{include file="../application/admin/view/health/base.html" /}
<div id="detailInit" class="container-form-box" v-cloak>
	<el-form :model="detailForm" ref="detailForm" :rules="rules" label-width="120px" class="dialog-form">
		<el-form-item label="任务名称：" prop="name">
			<el-input v-model="detailForm.name" placeholder="请输入任务名称" size="small"></el-input>
		</el-form-item>
		<el-form-item label="任务描述：" prop="description">
			<el-input type="textarea" autosize v-model="detailForm.description" placeholder="请输入任务描述"
			          size="small">
			</el-input>
		</el-form-item>
		<el-form-item label="完成次数：" prop="complete_num">
			<el-input-number :disabled="complete_way.rule.complete_num!=0" v-model="detailForm.complete_num" :min="1"
			                 :max="10">
			</el-input-number>
		</el-form-item>
		<el-form-item label="奖励类型：" prop="award_type">
			<el-radio-group v-model="detailForm.award_type" size="small">
				<el-radio-button v-for="(item,index) in award_type_map" :key="index" :label="item.name">
					{{item.label}}
				</el-radio-button>
			</el-radio-group>
		</el-form-item>
		<el-form-item label="奖励值：" prop="award_value">
			<el-input-number v-model="detailForm.award_value" :precision="2" :step="1" :min="0">
			</el-input-number>
		</el-form-item>
		<el-form-item label="完成方式：" prop="complete_way">
			<el-select :disabled="true" v-model="detailForm.complete_way" placeholder="请选择完成方式">
				<el-option v-for="item in complete_way_map" :key="item.name" :label="item.label" :value="item.name">
				</el-option>
			</el-select>
		</el-form-item>
		<!-- 完成方式规则 STAR -->
		<template v-if="detailForm.complete_way===1">
			<el-form-item label="选择视频：" prop="complete_way_content.video_id" :rules="[
            { required: true, message: '请选择视频：', trigger: 'blur' }
          ]">
				<el-select v-model="detailForm.complete_way_content.video_id" placeholder="请选择视频">
					<el-option v-for="(item,index) in complete_way.video_list" :key="index" :label="item.name"
					           :value="String(item.id)">
						<div style="display: flex;justify-content: space-between;">
							<div>{{ item.name }}</div>
							<div
									style="display:flex;align-items: center;margin-left:30px;color: #8492a6; font-size: 13px">
								<div>时长:{{ item.duration_text }}</div>
								<div style="padding-left:5px ;"><a target="_blank" :href="item.url">查看视频</a></div>
							</div>
						</div>
					</el-option>
				</el-select>
			</el-form-item>
			<el-form-item v-if="detailForm.complete_way_content.video_id" label="最少观看时长："
			              prop="complete_way_content.duration" :rules="[
                { required: true, message: '请设置最少观看时长', trigger: 'blur' }
              ]">
				<el-input-number v-model="detailForm.complete_way_content.duration" :step="1" :min="1"
				                 :max="selectVideoObj?.duration">
				</el-input-number>
			</el-form-item>
		</template>
		<!-- 完成方式规则 END -->
		<el-form-item label="状态：" prop="status">
			<div class="display-flex" style="height: 40px;">
				<el-switch v-model="detailForm.status" :active-value="1" :inactive-value="0" active-color="#7438D5"
				           inactive-color="#eee">
				</el-switch>
				<div style="margin-left: 20px;">
					{{detailForm.status==1?'启用':'禁用'}}
				</div>
			</div>
		</el-form-item>
	</el-form>
	<div class="dialog-footer display-flex">
		<div @click="submitForm(false,'detailForm')" class="dialog-cancel-btn display-flex-c cursor-pointer">取消</div>
		<div @click="submitForm('yes','detailForm')" class="dialog-define-btn display-flex-c cursor-pointer">确定</div>
	</div>
</div>